<!DOCTYPE html>
<html lang="zh">
  <head>
    <meta charset="utf-8">
    <title>{% block caption %}{% block title %}{% endblock %} - 韻典網{% endblock %}</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="BYVoid">
    <meta content="{% block keywords %}{% endblock %}廣韻, 切韻, 韻書, 分韻撮要, 平水韻, 中原音韻, 上古漢語, 上古音系, 古音, 方言" name="keywords" />
    <link href="/static/css/bootstrap.min.css" rel="stylesheet">
    <style type="text/css">
      body {
        padding-top: 60px;
        padding-bottom: 40px;
      }
      .sidebar-nav {
        padding: 9px 0;
      }
      .vertical {
        writing-mode: vertical-lr;
        text-orientation: mixed;
        direction: ltr;
        text-align: left;
      }
      .table-nowrap td,
      .table-nowrap th {
        white-space: nowrap;
      }
    </style>
    <link href="/static/css/bootstrap-responsive.min.css" rel="stylesheet">
    {% if request.session.layout == 'vertical' %}
      {% include "vertical_style.html" %}
    {% else %}
      <style type="text/css">
        .display-only-with-vertical-layout, #switch-to-horizontal-layout {
          display: none;
        }
        .thumbnails>li {
          float: right;
        }
        #search-form {
          float: right;
        }
        title-cn:before {
          content: "《";
        }
        title-cn:after {
          content: "》";
        }
        title-cn-quote:before {
          content: "「";
        }
        title-cn-quote:after {
          content: "」";
        }        
      </style>
    {% endif %}    
    <!--[if lt IE 9]>
      <script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <link rel="shortcut icon" href="/favicon.ico">
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="/static/ico/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="/static/ico/apple-touch-icon-114-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="/static/ico/apple-touch-icon-72-precomposed.png">
    <link rel="apple-touch-icon-precomposed" href="/static/ico/apple-touch-icon-57-precomposed.png">
  </head>
  <body>
    <div class="navbar navbar-fixed-top">
      <div class="navbar-inner">
        <div class="container horizontal-cn">
          <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </a>
          <span class="display-only-with-vertical-layout">
            <a id="seal" class="brand" href="{% url 'index_page' %}">
              <img src="/static/img/seal_dark.gif" title="韻典網" width="45" height="45">
            </a>
          </span>
          <a id="brand" class="brand" href="{% url 'index_page' %}">
            <img src="/static/img/brand.gif" title="韻典網" class="display-unless-with-vertical-layout" width="100" height="40">
          </a>          
          <form id="search-form" class="navbar-search" action="{% url 'zim' %}">	
            {% if request.session.layout == 'vertical' %}	
              <input type="text" class="search-query span3" name="dzih" placeholder="&#x202e;置字于此以詢之">              	
            {% else %}	
              <input type="text" class="search-query span3" name="dzih" placeholder="在此輸入要檢索的字">              	
            {% endif %}	
            <input type="hidden" name="dzyen" value="1">	
            <input type="hidden" name="jtkb" value="1">	
            <input type="hidden" name="jtkd" value="1">	
            <input type="hidden" name="jtdt" value="1">	
            <input type="hidden" name="jtgt" value="1">              	
          </form>          
          <div class="nav-collapse">
            <ul class="nav">
              <li class="{% block index_active %}{% endblock %}">
                <a href="{% url 'index_page' %}">首䈎</a>
              </li>
              <li class="{% block kyonh_active %}{% endblock %}">
                <a href="{% url 'kyonh' %}">廣韻</a>
              </li>
              <li class="{% block trngyan_active %}{% endblock %}">
                <a href="{% url 'triung_ngyan_qim_yonh' %}">中原音韻</a>
              </li>
              <li class="{% block tcenghyonhtsen_active %}{% endblock %}">
                <a href="{% url 'tcenghyonhtsen' %}">洪武正韻牋</a>
              </li>
              <li class="{% block pyonh_active %}{% endblock %}">
                <a href="{% url 'pyon_yonh' %}">分韻撮要</a>
              </li>
              <li class="{% block dciangxkox_active %}{% endblock %}">
                <a href="{% url 'dciangx_kox' %}">上古音系</a>
              </li>
              <li class="{% block byoh_lyuk_active %}{% endblock %}">
                <a href="{% url 'byoh_lyuk' '' %}">附錄</a>
              </li>
              <li class="{% block about_active %}{% endblock %}">
                <a href="{% url 'about_page' %}">關於</a>
              </li>
              <li class="{% block kiemx_sriek_active %}{% endblock %}">
                <a href="{% url 'kiemx_sriek' %}">高級檢索</a>
              </li>
              <li id="switch-to-horizontal-layout">
                <a href="{% url 'renew_session' %}?layout=horizontal&path={{ request.get_full_path|urlencode }}">橫版</a>
              </li>
              <li id="switch-to-vertical-layout">
                <a href="{% url 'renew_session' %}?layout=vertical&path={{ request.get_full_path|urlencode }}">縱版(Beta)</a>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </div>
    <div class="container container-main">
      <div class="row write-as-layout-direction">
        {% block body %}{% endblock %}
      </div>
      <hr>
      <footer class="footer">
        <p class="pull-right">
          <small>
          Copyright 2011-2020 <a href="https://www.byvoid.com/">BYVoid</a>
          <script language="javascript" type="text/javascript" src="//js.users.51.la/9523530.js"></script>
<noscript><a href="http://www.51.la/?9523530" target="_blank"><img alt="&#x6211;&#x8981;&#x5566;&#x514D;&#x8D39;&#x7EDF;&#x8BA1;" src="http://img.users.51.la/9523530.asp" style="border:none" /></a></noscript>
          </small>
        </p>
        <p>
          <a href="http://validator.w3.org/check?uri=referer" target="_blank">
          	<img src="/static/ico/html5.png" alt="Valid HTML5" height="30" />
          </a>
          <a href="http://www.djangoproject.com/" target="_blank">
          	<img src="/static/ico/django.png" alt="Django" width="30" height="30"/>
          </a>
          <a href="http://www.python.org/" target="_blank">
          	<img src="/static/ico/python.png" alt="Python" width="30" height="30"/>
          </a>
          <a href="http://www.sqlite.org/" target="_blank">
          	<img src="/static/ico/sqlite.jpg" alt="SQLite" width="30" height="30"/>
          </a>
          <a href="http://www.byvoid.com" target="_blank">
          	<img src="/static/ico/byvoid.png" alt="BYVoid" width="30" height="30" /> 
          </a>
        </p>
      </footer>
    </div>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script src="/static/js/bootstrap.min.js"></script>
    <!-- Global site tag (gtag.js) - Google Analytics -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-128961393-1"></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());

      gtag('config', 'UA-128961393-1');
    </script>
  </body>
</html>
